<ion-header>
    <header-component>
        <ion-toolbar>
            <ion-buttons class="button-left" (click)="closeModal()">
                <img src="assets/imgs/return.svg" alt="">
            </ion-buttons>
            <ion-title>{{ infoName }}</ion-title>
            <ion-icon class="button-right" (click)="changeInfo(infoIndex)" *ngIf="infoIndex != '2'" ios="ios-checkmark-circle-outline" md="ios-checkmark-circle-outline"></ion-icon>
        </ion-toolbar>
    </header-component>
</ion-header>
<ion-content class="user-infos">
    <div class="user-name" *ngIf="infoName == '用户名'">
        <input type="text" [(ngModel)]="cache.userinfo.userName">
    </div>
    <div class="user-password" *ngIf="infoName == '密码'">
        <div>
            <label for="密码">原密码</label>
            <input type="text" placeholder="请输入原密码" [(ngModel)]="Password.old">
        </div>
        <div>
            <label for="">新密码</label>
            <input type="text" placeholder="字母开头6-12位" [(ngModel)]="Password.new">
        </div>
    </div>
    <div class="user-phone" *ngIf="infoName == '手机号'">
        <div>
            <label for="">手机号</label>
            <input readonly="readonly" [(ngModel)]="userItems.phone">
        </div>
        <button (click)="changePhone()">更换手机号码</button>
        <p>一个手机只能绑定一个账号的登录名</p>
    </div>
    <div class="user-email" *ngIf="infoName == '邮箱'">
        <input type="text" [(ngModel)]="userItems.EMail">
    </div>
</ion-content>